<%--
  Created by IntelliJ IDEA.
  User: kwc13
  Date: 2022/6/23
  Time: 10:00
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
  <script src="/Web_page/Vue.js"></script>
  <script src="/Web_page/JQuery.min.js"></script>
  <link href="/Web_css/page_Header.css" rel="stylesheet" type="text/css"/>
  <script src="/Web_js/page_Header.js" language="JavaScript" type="text/javascript"></script>
<div class="home">
  <div class="front_Page">
    <!-- 导航栏 -->
    <div class="navigation_Bar">
      <div class="limit_Bar">
        <div class="main_Body">
          <ul>
            <li><a href="#">小米商城</a></li>
            <li><span></span></li>
            <li><a href="#">MIUI</a></li>
            <li><span></span></li>
            <li><a href="#">loT</a></li>
            <li><span></span></li>
            <li><a href="#">云服务</a></li>
            <li><span></span></li>
            <li><a href="#">天星科技</a></li>
            <li><span></span></li>
            <li><a href="#">有品</a></li>
            <li><span></span></li>
            <li><a href="#">小爱开放平台</a></li>
            <li><span></span></li>
            <li><a href="#">企业团购</a></li>
            <li><span></span></li>
            <li><a href="#">资质证照</a></li>
            <li><span></span></li>
            <li><a href="#">协议规则</a></li>
            <li><span></span></li>
            <li><a href="#">下载app</a></li>
            <li><span></span></li>
            <li><a href="#">Select Location</a></li>
          </ul>
        </div>
        <div class="main_Personal">
          <ul class="information">
            <li class="nameRow"><a href="/login?toggle=1" class="mysqlname" style="width: 100px;">登陆</a></li>
            <li><span></span></li>
            <li><a href="/login?toggle=2" class="notification">注册</a></li>
            <li><span></span></li>
            <li><a href="#" class="order">信息通知</a></li>
          </ul>
        </div>
        <div class="shopping_Cart">
          <a href="/login" class="shopping_Cart_Text">购物车</a>
          <script>
            var url = window.location.href;
            var reg = RegExp(/,/);
            if (reg.test(url)){
              var urlarr = url.split(",")
              var shopping_Cart_Text = document.getElementsByClassName("shopping_Cart_Text")
              shopping_Cart_Text[0].href = "/Shopping_cart?id="+urlarr[1];
            }
          </script>
        </div>
      </div>
    </div>
    <!-- 导航栏 -->

    <!-- 网页主题内容 -->
    <div class="body">
      <!-- 导航栏 搜索部分 -->
      <div class="body_Search">
        <div class="logo"><img src="/Web_img/xiaomi_logo.png"></div>
        <div class="navigation_Bar_Index">
          <ul>
            <li><a href="#" class="category">Xiaomi手机</a></li>
            <li><a href="#" class="category">Redmi&nbsp;手机</a></li>
            <li><a href="#" class="category">电视</a></li>
            <li><a href="#" class="category">笔记本</a></li>
            <li><a href="#" class="category">平板</a></li>
            <li><a href="#" class="category">家电</a></li>
            <li><a href="#" class="category">路由器</a></li>
            <li><a href="#" class="category">服务中心</a></li>
            <li><a href="#" class="category">社区</a></li>
          </ul>
        </div>
        <div class="search_Frame">
          <form class="search_From">
            <span><input type="text"></span><div class="search_Img"><a href=""><img src="/Web_img/search_%23fff.png"></a></div>
          </form>
        </div>
      </div>
      <!-- 导航栏 搜索部分 -->

      <!-- 隐藏部分  Xiaomi-->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic"  href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_cell_phone1.png" class="img1" state="false">
                <div class="information">
                  <span class="name1">Xiaomi Civi 1S</span>
                  <p class="price1">2299元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- Redmi -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Redmi_cell_phone2.png" class="img2" state="false">
                <div class="information">
                  <span class="name2">Redmi Not 11T Pro+</span>
                  <p class="price2">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- 小米电视 -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_television1.jpg" class="img3" state="false">
                <div class="information">
                  <span class="name3">Redmi Not 11T Pro+</span>
                  <p class="price3">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- 笔记本 -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_notebook1.png" class="img4" state="false">
                <div class="information">
                  <span class="name4">Redmi Not 11T Pro+</span>
                  <p class="price4">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- 平板 -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_flat1.jpg" class="img5" state="false">
                <div class="information">
                  <span class="name5">Redmi Not 11T Pro+</span>
                  <p class="price5">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- 家电 -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_air_conditioner1.jpg" class="img6" state="false">
                <div class="information">
                  <span class="name6">Redmi Not 11T Pro+</span>
                  <p class="price6">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>

      <!-- 路由器 -->
      <div class="hidden_Content">
        <div class="content_Cell_Phone">
          <ul>
            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>

            <li><span class="fill"></span></li>

            <li>
              <a class="basic" href="#">
                <img src="/Web_img/Xiaomi_router1.jpg" class="img7" state="false">
                <div class="information">
                  <span class="name7">Redmi Not 11T Pro+</span>
                  <p class="price7">1999元起</p>
                </div>
              </a>
            </li>
          </ul>
        </div>
      </div>
      <!-- 隐藏部分 -->
    </div>
  </div>
</div>

